<!--<style lang="less">-->
  <!--.hello_world {-->
    <!--background-color: #795da3;-->
    <!--width: 80px;-->
  <!--}-->
<!--</style>-->

<!--<template>-->
  <!--<div >-->
<!--<el-button @click="show = ! show">点这里</el-button>-->
    <!--<div ><el-collapse-transition>-->
      <!--<div v-show="show">-->
        <!--<div class="hello_world">el-collapse-transition</div>-->
        <!--<div class="hello_world">el-collapse-transition</div>-->
      <!--</div>-->
    <!--</el-collapse-transition></div>-->
  <!--</div>-->
<!--</template>-->

<!--<script>-->
  <!--export default {-->
    <!--data () {-->
      <!--return {-->
        <!--show: true-->
      <!--};-->
    <!--}-->
  <!--};-->
<!--</script>-->


<!-- ********************************** 全选，element组件练习******************************************* -->
<!--<style lang="less">-->

<!--</style>-->
<!--<template>-->
  <!--<div>-->
  <!--<el-checkbox  :indeterminate = "isIndeterminate" v-model = "checkAll" @change = "handleCheckAllChange">全选</el-checkbox>-->
  <!--<div style = "margin : 15px  0;"></div>-->
  <!--<el-checkbox-group v-model = "checkedCities" >-->
    <!--<el-checkbox v-for = "city in cities" :label = "city" :key = "city" @change = "handleCheckedCitiesChange">{{city}}</el-checkbox>-->
  <!--</el-checkbox-group>-->
  <!--</div>-->
<!--</template>-->
<!--<script>-->
  <!--const cityOptions = [ '上海', '北京', '广州', '深圳' ];-->
  <!--export default{-->
    <!--data () {-->
      <!--return {-->
        <!--checkAll: true,-->
        <!--checkedCities: [ '上海', '北京' ],-->
        <!--cities: cityOptions,-->
        <!--isIndeterminate: true-->
      <!--};-->
    <!--},-->
    <!--methods: {-->
      <!--handleCheckAllChange (event) {-->
        <!--this.checkedCities = event.target.checked ? cityOptions : [];-->
        <!--this.isIndeterminate = false;-->
      <!--},-->
      <!--handleCheckedCitiesChange (value) {-->
        <!--let checkedCount = value.length;-->
        <!--this.checkAll = checkedCount === this.cities.length;-->
        <!--this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;-->
      <!--}-->
    <!--}-->
  <!--};-->
<!--</script>-->
<!-- ******************************************计数******************************************* -->
<template>
  <el-input-number v-model = "num" @change = "handleChange" :min = "1" :max = "10"></el-input-number>
</template>
<script>
  export default{
    data () {
      return {
        num: 0
      };
    },

    methods: {
      handleChange (value) {
        console.log(value);
      }
    }
  };
</script>
